import { Button, Popconfirm, Switch, Tooltip } from 'antd';
import { Fragment } from 'react';
import {
  EditOutlined,
  EyeOutlined,
  AuditOutlined,
  FileExcelOutlined,
  VerticalAlignTopOutlined,
  VerticalAlignBottomOutlined,
  ReconciliationOutlined,
} from '@ant-design/icons';
import { AnnounceManageAPI } from '../common/type';
import {
  getColorTextLoadMap,
  getTenantID,
  getUserID,
  tooltipLength,
} from '@/utils';
import pageStyles from '@/common/pageLayout.less';
import MyIcon from '@/components/MyIcon';

/** 公告管理页面功能操作 */
const getManageFunctions = (
  /** 资源权限参数 */
  permissions: Record<string, any>,
  /** 数据操作参数 */
  operateFnc: AnnounceManageAPI.ITableActionType,
  /** 数据操作对象 */
  record: Record<string, any>,
) => {
  /** 功能操作集 */
  let operationList: any = [];

  /** 字体样式 */
  let textStyle: React.CSSProperties = {
    fontSize: '.75rem',
  };
  /** 编辑操作 */
  const EditFunc =
    permissions['/announceController/edit'] &&
    (record?.state == `${getTenantID()}12021000` ||
      record?.state == `${getTenantID()}12021003`) &&
    record?.ownerID == getUserID() ? (
      <Fragment key={record?.id + 'EditOutlined'}>
        <Button
          style={textStyle}
          type={'link'}
          size={'small'}
          icon={<EditOutlined />}
          onClick={() => {
            operateFnc?.onEdit(record);
          }}
        >
          编辑
        </Button>
      </Fragment>
    ) : (
      <></>
    );

  /**
   * 查看详情
   */
  const View = !!permissions['/announceController/getAnnounceByID'] && (
    <Fragment key={record?.id + 'EyeOutlined'}>
      <Button
        style={textStyle}
        onClick={() => {
          operateFnc?.onView(record);
        }}
        type={'link'}
        size={'small'}
        icon={<EyeOutlined />}
      >
        查看
      </Button>
    </Fragment>
  );

  const Apply = !!permissions['/announceController/addCheck'] &&
    (record?.state == `${getTenantID()}12021000` ||
      record?.state == `${getTenantID()}12021003`) &&
    record?.ownerID == getUserID() && (
      <Fragment key={record?.id + 'AuditOutlined'}>
        {/* <Popconfirm
          title={<span style={{ fontWeight: 600 }}>确认要提交审核吗？</span>}
          onConfirm={(e) => {
            e?.stopPropagation();
            operateFnc?.onCheck(record);
          }}
          showCancel={false}
          okType={'default'}
        > */}
        <Button
          style={textStyle}
          type={'link'}
          size={'small'}
          icon={<AuditOutlined />}
          onClick={() => {
            operateFnc?.onCheck(record);
          }}
        >
          提交
        </Button>
        {/* </Popconfirm> */}
      </Fragment>
    );

  const Cancel = !!permissions['/announceController/cancel'] &&
    (record?.state == `${getTenantID()}12021000` ||
      record?.state == `${getTenantID()}12021003` ||
      record?.state == `${getTenantID()}12021005`) && (
      <Fragment key={record?.id + 'FileExcelOutlined'}>
        <Button
          style={textStyle}
          onClick={() => {
            operateFnc?.onCancel(record);
          }}
          type={'link'}
          size={'small'}
          icon={<FileExcelOutlined />}
        >
          作废
        </Button>
      </Fragment>
    );

  const IsTop = !!permissions['/announceController/toTop'] &&
    record?.state == `${getTenantID()}12021002` && (
      <Fragment key={record?.id + 'VerticalAlignTopOutlined'}>
        <Popconfirm
          title={
            <span style={{ fontWeight: 600 }}>
              确认要
              {record?.isTop == '0' && '置顶'}
              {record?.isTop == '1' && '取消置顶'}
              该公告吗？
            </span>
          }
          onConfirm={(e) => {
            e?.stopPropagation();
            operateFnc?.onIsTop(record);
          }}
          // showCancel={false}
          okType={'primary'}
        >
          <Button
            style={textStyle}
            type={'link'}
            size={'small'}
            icon={
              record?.isTop == '0' ? (
                <VerticalAlignTopOutlined />
              ) : record?.isTop == '1' ? (
                <VerticalAlignBottomOutlined />
              ) : null
            }
          >
            {record?.isTop == '0' && '置顶'}
            {record?.isTop == '1' && '取消置顶'}
          </Button>
        </Popconfirm>
      </Fragment>
    );

  const Check = record?.checkerID == getUserID() &&
    record?.state == `${getTenantID()}12021001` &&
    permissions?.['/announceController/checkIssue'] && (
      <Fragment key={record?.id + 'ReconciliationOutlined'}>
        <Button
          style={textStyle}
          onClick={() => {
            operateFnc?.goToCheck(record);
          }}
          type={'link'}
          size={'small'}
          icon={<ReconciliationOutlined />}
        >
          审核
        </Button>
      </Fragment>
    );

  /** 一个按钮都没有时展示*/
  const Disable = (
    <Fragment key={record?.id + '--Disable'}>
      <Button
        style={{ color: '#000' }}
        className='manageBtntTxtStyle'
        type={'link'}
        size={'small'}
        disabled
      >
        --
      </Button>
    </Fragment>
  );

  operationList = [View, EditFunc, IsTop, Apply, Check, Cancel];
  operationList = operationList?.filter((itemBtn: any) => itemBtn);
  return operationList && operationList?.length > 0 ? operationList : [Disable];
};

/**
 * 公告管理数据表格信息 展示和操作
 * @returns
 */
const getAnnounceManageTableColumns = (
  /** 资源权限参数 */
  permissions: Record<string, any>,
  /** 数据操作参数 */
  operateFnc: AnnounceManageAPI.ITableActionType,
) => {
  return [
    {
      title: '公告标题',
      dataIndex: 'announceTitle',
      key: 'announceTitle',
      width: 220,
      visible: true,
      unDrag: true,
      fixed: 'left',
      render: (text: string | null) => {
        return (
          <Tooltip title={tooltipLength(text, 100)}>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 210 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.announceTitle < b.announceTitle) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '公告内容',
      dataIndex: 'announceContent',
      key: 'announceContent',
      width: 250,
      visible: true,
      render: (text: string | null, record: Record<string, any>) => {
        return (
          <Tooltip
            title={tooltipLength(record?.announceContent?.contentText, 100)}
          >
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 240 }}
            >
              {record?.announceContent?.contentText || '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '公告类型',
      dataIndex: 'announceTypeName',
      key: 'announceTypeName',
      width: 100,
      visible: true,
      // ellipsis: {
      //   showTitle: true,
      // },
      sorter: (a: any, b: any) =>
        a.announceTypeName > b.announceTypeName ? 1 : -1,
      render: (text: string) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip>
            <span style={{ color: color }}>{colorText ? colorText : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '发布范围',
      dataIndex: 'viewRange',
      key: 'viewRange',
      width: 100,
      visible: true,
      // ellipsis: {
      //   showTitle: true,
      // },
      sorter: (a: any, b: any) => (a.viewRange > b.viewRange ? 1 : -1),
      render: (text: string) => {
        let newText = '';
        if (text == '0') {
          newText = '公司';
        } else if (text == '1') {
          newText = '部门';
        }
        return (
          <Tooltip>
            <span>{newText ? newText : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '是否置顶',
      dataIndex: 'isTop',
      key: 'isTop',
      width: 100,
      visible: true,
      // ellipsis: {
      //   showTitle: true,
      // },
      sorter: (a: any, b: any) => a.isTop - b.isTop,
      render: (text: string) => {
        let newText = '';
        if (text == '0') {
          newText = '否';
        } else if (text == '1') {
          newText = '是';
        }
        return (
          <Tooltip>
            <span>{newText ? newText : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '公告状态',
      dataIndex: 'stateName',
      key: 'stateName',
      width: 100,
      visible: true,
      // ellipsis: {
      //   showTitle: true,
      // },
      sorter: (a: any, b: any) => (a.stateName > b.stateName ? 1 : -1),
      render: (text: string) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip>
            <MyIcon type="icon-dian" style={{ color: color }} />
            <span style={{ color: color }}>{colorText ? colorText : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '公示时间',
      dataIndex: 'startTime',
      key: 'startTime',
      width: 180,
      visible: true,
      sorter: (a: any, b: any) => (a.startTime > b.startTime ? 1 : -1),
      render: (text: string, record: Record<string, any>) => {
        let newText: string = '';
        if (record?.startTime || record?.endTime) {
          newText = `${
            record?.startTime ? record?.startTime?.split(' ')?.[0] : '--'
          } ~ ${record?.endTime ? record?.endTime?.split(' ')?.[0] : '--'}`;
        }
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 170 }}
            >
              {newText ? newText : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '编撰时间',
      dataIndex: 'createTime',
      key: 'createTime',
      width: 120,
      visible: false,
      sorter: (a: any, b: any) => (a.createTime > b.createTime ? 1 : -1),
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 110 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '编撰人',
      dataIndex: 'createrName',
      key: 'createrName',
      width: 120,
      visible: true,
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 110 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.createrName < b.createrName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '编撰岗位',
      dataIndex: 'createPositionName',
      key: 'createPositionName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.createPositionName < b.createPositionName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '编撰部门',
      dataIndex: 'createDepartmentName',
      key: 'createDepartmentName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.createDepartmentName < b.createDepartmentName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '编撰公司',
      dataIndex: 'createCompanyName',
      key: 'createCompanyName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.createCompanyName < b.createCompanyName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '签发时间',
      dataIndex: 'signTime',
      key: 'signTime',
      width: 120,
      visible: false,
      sorter: (a: any, b: any) => (a.signTime > b.signTime ? 1 : -1),
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 110 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '签发人',
      dataIndex: 'signerName',
      key: 'signerName',
      width: 120,
      visible: true,
      sorter: (a: any, b: any) => (a.signerName > b.signerName ? 1 : -1),
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 110 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '签发岗位',
      dataIndex: 'signPositionName',
      key: 'signPositionName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.signPositionName < b.signPositionName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '签发部门',
      dataIndex: 'signDepartmentName',
      key: 'signDepartmentName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.signDepartmentName < b.signDepartmentName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '签发公司',
      dataIndex: 'signCompanyName',
      key: 'signCompanyName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.signCompanyName < b.signCompanyName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '作废类型',
      dataIndex: 'cancelTypeName',
      key: 'cancelTypeName',
      width: 100,
      visible: true,
      // ellipsis: {
      //   showTitle: true,
      // },
      sorter: (a: any, b: any) =>
        a.cancelTypeName > b.cancelTypeName ? 1 : -1,
      render: (text: string) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip>
            <span style={{ color: color }}>{colorText ? colorText : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '作废原因',
      dataIndex: 'cancelReason',
      key: 'cancelReason',
      width: 250,
      visible: false,
      render: (text: string | null, record: Record<string, any>) => {
        return (
          <Tooltip title={tooltipLength(text, 100)}>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 240 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '作废时间',
      dataIndex: 'cancelTime',
      key: 'cancelTime',
      width: 120,
      visible: false,
      sorter: (a: any, b: any) => (a.cancelTime > b.cancelTime ? 1 : -1),
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 110 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '作废人',
      dataIndex: 'cancelerName',
      key: 'cancelerName',
      width: 120,
      visible: true,
      sorter: (a: any, b: any) => (a.cancelerName > b.cancelerName ? 1 : -1),
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 110 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '作废岗位',
      dataIndex: 'cancelPositionName',
      key: 'cancelPositionName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.cancelPositionName < b.cancelPositionName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '作废部门',
      dataIndex: 'cancelDepartmentName',
      key: 'cancelDepartmentName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.cancelDepartmentName < b.cancelDepartmentName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '作废公司',
      dataIndex: 'cancelCompanyName',
      key: 'cancelCompanyName',
      width: 150,
      visible: false,
      render: (text: string | null) => {
        return (
          <Tooltip title={text}>
            <span
              className={pageStyles['over-flow-hidden']}
              style={{ maxWidth: 140 }}
            >
              {text ? text : '--'}
            </span>
          </Tooltip>
        );
      },
      sorter: (a: any, b: any) => {
        if (a.cancelCompanyName < b.cancelCompanyName) {
          return -1;
        } else {
          return 1;
        }
      },
    },
    {
      title: '操作',
      dataIndex: 'operation',
      key: 'operation',
      width: 300,
      visible: true,
      unDrag: true,
      fixed: 'right',
      render: (text: any, record: any) => {
        return (
          <div
            style={{
              display: 'flex',
            }}
          >
            {getManageFunctions(permissions, operateFnc, record)}
          </div>
        );
      },
    },
  ];
};

export { getAnnounceManageTableColumns };
